<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>对话框按钮</title>
    <script src="../../jquery.js"></script>
    <script src="../../ui/om-core.js"></script>
    <script src="../../ui/om-mouse.js"></script>
    <script src="../../ui/om-draggable.js"></script>
    <script src="../../ui/om-position.js"></script>
    <script src="../../ui/om-button.js"></script>
    <script src="../../ui/om-dialog.js"></script>
    <link rel="stylesheet" href="../../themes/default/om-all.css">
    <link rel="stylesheet" href="../common/css/demo.css">
    <!-- view_source_begin -->
    <script>
    $(function() {
        $("#dialog-confirm").omDialog({
            autoOpen : true, 
            resizable: false,
            width: 500,
            buttons: [{
                text : "够的", 
                click : function () {
                    $("#res_txt").text("恭喜你，妹纸都是你的");
                    $("#dialog-confirm").omDialog("close");
                }
            }, {
                text : "不够", 
                click : function () {
                    $("#res_txt").text("儿女情长，多经几次失恋，下一个总是最好的");
                    $("#dialog-confirm").omDialog("close");
                }
            }]
        });
        
        $("#dialog-success").omDialog({
            autoOpen : false, 
            resizable: false,
            width: 500,
            buttons: [{
                text : "确定", 
                click : function () {
                    $("#res_txt").text("使用operamasks-ui将给你带来更快的开发效率");
                    $("#dialog-success").omDialog("close");
                }
            }]
        });
        
        $("#dialog-error").omDialog({
            autoOpen : false, 
            resizable: false,
            width: 500,
            buttons: [{
                text : "确定", 
                click : function () {
                    $("#res_txt").text("系统繁忙，请您稍后重试");
                    $("#dialog-error").omDialog("close");
                }
            }]
        });
        
        $("#confirm_btn").click(function() {
            $("#dialog-confirm").omDialog("open");
            return false;
        });
        
        $("#success_btn").click(function() {
            $("#dialog-success").omDialog("open");
            return false;
        });
        
        $("#error_btn").click(function() {
            $("#dialog-error").omDialog("open");
            return false;
        });
    });
    </script>
    <!-- view_source_end -->
</head>
<body>
    <!-- view_source_begin -->
    <input id="confirm_btn" value="提示样式" type="button"/>
    <input id="success_btn" value="成功样式" type="button"/>
    <input id="error_btn" value="失败样式" type="button"/>
    <div id="res_txt" style="font-size: 20px;"></div>
    
    <div id="dialog-confirm" title="温馨提问" style="padding:30px; display: none;">
        <div style="background: url(images/ico_tip.png) no-repeat -6px -5px;padding-left:70px;height:auto!important; height:50px; min-height:50px;">
            <h4 style="font-size:14px; padding-top: 12px; margin: 0px;">请问你的内心够强大吗？</h4>
        </div>
    </div>
    
    <div id="dialog-success" title="恭喜你..." style="padding:30px; display: none;">
        <div style="background: url(images/ico_success.png) no-repeat -6px -5px;padding-left:70px;height:auto!important; height:50px; min-height:50px;">
            <h4 style="font-size:14px; padding-top: 12px; margin: 0px;">恭喜你，使用operamasks-ui将给你带来更快的开发效率</h4>
        </div>
    </div>
    
    <div id="dialog-error" title="很遗憾..." style="padding:30px; display: none;">
        <div style="background: url(images/ico_error.png) no-repeat -6px -5px;padding-left:70px;height:auto!important; height:50px; min-height:50px;">
            <h4 style="font-size:14px; padding-top: 12px; margin: 0px;">系统繁忙，请您稍后重试</h4>
        </div>
    </div>
    <!-- view_source_end -->
    
    <div id="view-desc">
        方便地定义对话框按钮。
    </div>
    <script type="text/javascript" src="../common/js/themeloader.js"></script>
</body>
</html>
